<template>
  <h1>toRef的使用</h1>
  <h1 v-text="user.name"></h1>
</template>

<script setup>
// toRef: 把一个 reactive对象中的某个属性变成 ref 变量。
import { ref, isRef, unref, reactive, toRef } from "vue";
let user = reactive({
  name: "wc",
  age: 18,
});
setTimeout(() => {
  user.name = "xq";
}, 1000);

// user叫reactive变量
console.log(user);
console.log(isRef(user));
console.log(isRef(user.name));
console.log(isRef(user.age));
console.log("-----------------");
// let name = toRef(user.name);
let name = toRef(user, "name");
console.log(isRef(name));
console.log(name.value);
</script>

<style lang="scss" scoped>
</style>